<template>
    <div class="big">
        <!-- <h1>我的关注页</h1> -->
        <div class="box">
            <van-nav-bar left-text="返回" left-arrow @click-left="$router.back()" />
        </div>
        <div class="content">
            <h1>我的关注</h1>
            <div class="title">
                <span><van-icon name="clock-o" /> 时间</span>
                <span>13:00-17:30 开放</span>
            </div>
            <div class="title">
                <span><van-icon name="location-o" /> 位置</span>
                <span @click="$router.push('/map')">美食区 11F > </span>
            </div>
            <div class="aside">
                <h3>景点介绍</h3>
                <p>
                    天安门（Tian'anmen），坐落在中华人民共和国首都北京市的中心、故宫的南端，与天安门广场以及人民英雄纪念碑、毛主席纪念堂、人民大会堂、中国国家博物馆隔长安街相望，占地面积4800平方米，以杰出的建筑艺术和特殊的政治地位为世人所瞩目。
                </p>
                <br>
                <p>
                    天安门是明清两代北京皇城的正门，始建于明朝永乐十五年（1417年），最初名“承天门”，寓“承天启运、受命于天”之意。设计者为明代御用建筑匠师蒯祥。清朝顺治八年（1651年）更名为天安门。由城台和城楼两部分组成，有汉白玉石的须弥座，总高34.7米。天安门城楼长66米、宽37米。城台下有券门五阙，中间的券门最大，位于北京市皇城中轴线上，过去只有皇帝才可以由此出入。正中门洞上方悬挂着毛泽东画像，两边分别是“中华人民共和国万岁”和“世界人民大团结万岁”的大幅标语。
                </p>
                <br>

                <br>
                <p>
                    1925年10月10日，故宫博物院成立，天安门开始对民众开放。1949年10月1日，在这里举行了中华人民共和国开国大典，由此被设计入国徽，并成为中华人民共和国的象征。1961年，中华人民共和国国务院公布为第一批全国重点文物保护单位之一。
                </p>
            </div>
        </div>
        <div class="btnBox">
            <van-button round type="warning" size="large" @click="care"> ❤️ 点击购票</van-button>
        </div>
    </div>
</template>
  
<script setup>
import { showSuccessToast, showFailToast } from 'vant';


let care = () => {
    showSuccessToast('购票成功');
    console.log(111);
}
</script>
  
<style lang="scss" scoped>
.big {
    display: flex;
    height: 100%;
    flex-direction: column;
    overflow: auto;

    .box {
        width: 375px;
        height: 281px;
        background: url('https://img1.baidu.com/it/u=265057613,1652686293&fm=253&fmt=auto&app=138&f=JPEG?w=750&h=500') 100%/cover;

        .van-nav-bar {
            background: transparent;
            color: white;
        }
    }

    .content {
        flex: 1;
        overflow: auto;
        padding: 0 10px;

        //   border-top-right-radius:25px;
        //   border-top-left-radius: 25px;
        // border: 1px solid black;
        h1 {
            height: 40px;
            line-height: 40px;
            text-align: center;
        }

        .title {
            height: 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        h3 {
            height: 40px;
            line-height: 40px;
        }

        p {
            text-indent: 24px;
        }
    }

    .btnBox {
        height: 50px;
        width: 375px;
        padding: 5px 10px;

        .van-button {
            width: 90%;
        }
    }
}
</style>